<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>借款记录</title>
    <link rel="stylesheet" href="/Public/css/bootstrap.min.css">
    <link href="/Public/css/animate.css" rel="stylesheet">
    <link rel="stylesheet" href="/Public/css/gxxjkefu-normalize.css">
    <link rel="stylesheet" href="/Public/css/model.css">
    <link rel="stylesheet" href="/Public/css/pager.css">

    <style>
        .user_name{
            cursor: pointer;
            color: black;
        }
        .user_name:hover{
            color: #31b0d5;
        }
        .search_user {
            padding: 20px 0;
            border-bottom: dashed 1px #c9c9c9;
        }
        .search_div {
            width: 790px;
            height: 40px;
            margin: 0 auto;
            padding-top: 10px;
            position: relative;
        }
        .search_div button {
            width: 103px;
            height: 33px;
            position: absolute;
            top: 10px;
            right: 0;
        }

        .search_button {
            width: 1200px;
            text-align: center;
            padding: 25px 0 40px;
            margin: 0 auto;
        }

        .search_button input {
            border: none;
            padding: 5px 15px;
            border-radius: 3px;
            margin: 0 12px;
            background: #eeeeee;
        }

        .search_button input:hover {
            background-color: #46b8da;
            color: white;
        }

        .search_button .input_active {
            background-color: #46b8da;
            color: white;
        }

        .search_table thead {
            background: #f0f8fa;
            border: none;
        }

        .table {
            margin: 0 auto;
            width: 100% !important;
            text-align: center;
        }

        .table > thead > tr > th {
            border-bottom: none !important;
            text-align: center !important;
        }

        .table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th {
            border-top: 1px solid #f0f8fa !important;
            text-align: center !important;
        }
        tr:nth-child(even) {background-color: #e7e7e7}
    </style>

</head>
<body>
<div id="main_C"  class="animated fadeInRight">
    <div class="search_table">
        <table class="table table-hover">
            <thead>
            <tr>
                <th>借款订单号</th>
                <th>还款金额</th>
                <th>部分还款</th>
                <th>应还款续借</th>
                <th>应还款手续费</th>
                <th>应还款时间</th>
                <th>实际还款时间</th>
                <th>还款类型</th>
                <th>天数</th>
                <th>状态</th>
                <th>操作</th>
            </tr>
            </thead>
            <tbody id="user_list">


            </tbody>
        </table>
        <div id="my_page" style="text-align: center;margin: 100px auto 0">
            <ul class="pagination" id="page"></ul>
            <div class="pageJump">
                <span>跳转到</span>
                <input type="text"/>
                <span>页</span>
                <button type="button" class="button"></button>
            </div>
        </div>
    </div>
</div>
<script src="/Public/js/jquery-3.2.1.js"></script>
<script src="/Public/js/bootstrap.min.js?v=3.3.6"></script>
<script src="/Public/js/content.js?v=1.0.0"></script>
<script src="/Public/js/pager.js"></script>
<script src="/Public/js/layer/layer.js"></script>
<script src="/Public/js/layui/layui.js"></script>

<script>
     var vid=window.parent.$("#vid_text").val();
     get_user(1);
     function get_user(n) {
        $.post("<{$SERVER_NAME}>/UserCenter/repayment_record_list", {vid: vid, page: n}, function (data) {
            if (data.code == '1001') {
                var obj = data.result;
                var len = obj.length;
                var s = "";
               console.log('33434343',data);
                if(n==1){
                    Page({
                        num: data.tol,					//页码数
                        startnum: 1,				//指定页码
                        elem: $('#page'),		//指定的元素
                        callback: function (n) {	//回调函数
                            get_user(n);
                        }
                    });
                    if (data.count < 10) {
                        $("#my_page").hide();
                    } else {
                        $("#my_page").show();
                    }
                }
                for (var i = 0; i < len; i++) {
                    s+="  <tr> <td>"+obj[i].borrow_no+"</td> " +
                        "<td>"+obj[i].repay_money+"</td> " +
                        "<td>"+obj[i].have_repay_money+"</td> " +
                        "<td>"+obj[i].renewal_money+"</td>" +
                        " <td>"+obj[i].fee+"</td>" +
                        " <td>"+obj[i].repay_time+"</td> " +
                        "<td>"+obj[i].real_time+"</td> " +
                        "<td>"+obj[i].type+"</td>" +
                        " <td>"+obj[i].day+"</td>" +
                        " <td>"+obj[i].status+"</td>" ;
                        if(obj[i].pay_status=='1'){
                            s+="<td> <a  onclick=wx_pay('"+obj[i].repayment_no+"','"+obj[i].repay_money+"') > 微信还款 </a></td>";
                        }else {
                            s+="<td><a> </a></td> </if> </tr>";
                        }
                }
                document.getElementById("user_list").innerHTML = s;
            }
        });
    }

     //微信支付
     function wx_pay(repayment_no,money) {

         var index = layer.load(1, {
             shade: [0.1, '#fff'] //0.1透明度的白色背景
         });
//         var vid="<{$vid}>";
         var url_apply="<{$SERVER_NAME}>/UserCenter/wx_pay";
         $.post(url_apply, {vid: vid,repayment_no:repayment_no,money:money}, function (data) {
             if (data.code == "1001") {
                 var codeImgUrl=data.result;
                 var codeUrl='';
                 console.log('90900',codeImgUrl+"===="+codeUrl);
                 open_view(codeImgUrl,codeUrl);
             } else {
                 console.log('dedeeeeeeee');
                 layer.alert(data.result, {title: '提示框', icon: 1});
             }
         });
         layer.close(index);
     }

     function open_view(codeImgUrl,codeUrl) {
         layer.open({
             title: '微信支付',
             type: 2,
             area: ['75%', '55%'],
             maxmin: true,
             offset: '100px',
             content: '<{$SERVER_NAME}>/UserCenter/wx_pay_view.html?picurl=' + codeImgUrl+"&url="+codeUrl,
             success: function (layero) {
                 layero.find('.layui-layer-min').remove();
             }
         });
     }
</script>
</body>
</html>